<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <!--Extjs version 6.2.0 -->
    <link href="css/theme-classic-all.css" rel="stylesheet" />
    <script type="text/javascript" src="locale/locale-zh_CN.js"></script>
    <script type="text/javascript" src="js/ext-all.js"></script>
    <script type="text/javascript">
        Ext.onReady(function() {
            Ext.define('User', {
                extend: 'Ext.data.Model',
                fields: [{
                    name: 'id',
                    mapping: 'id'
                }, {
                    name: 'name',
                    mapping: 'name'
                }]
            });
            var store = Ext.create('Ext.data.Store', {
                model: 'User',
                data: [{
                    id: "1",
                    name: "1xx"
                }, {
                    id: "2",
                    name: "2xx"
                }, {
                    id: "3",
                    name: "3xx"
                }, {
                    id: "4",
                    name: "4xx"
                }]
            });

            var combobox = new Ext.form.ComboBox({
                renderTo: Ext.getBody(),
                triggerAction: "all",
                store: store,
                editable: false,
                displayField: "name",
                valueField: "id",
                mode: "local", //数据来本地local 来之远程服务器用remote  
                emptyText: "请选择辽宁城市"
            });

            var btn = new Ext.Button({
                text: "列表框的值",
                renderTo: Ext.getBody(),
                handler: function() {
                    Ext.Msg.alert("城市", "展示值:" + combobox.getValue() + "; 后端值：" + combobox.getRawValue());
                }
            });

        });
    </script>
</head>

<body>

</body>

</html>